import { defineComponent, unref } from "vue";
import LoginForm from "./login-form";
import RegistForm from "./regist-form";
import UpdateForm from "./update-form";

import { useLoginState, LoginStateEnum } from "../utils/useLogin";
import "../login.scss";

/** 登录表单 */
const loginCard = defineComponent({
  components: {
    LoginForm,
    RegistForm,
    UpdateForm,
  },
  setup() {
    const { getLoginState } = useLoginState();

    /** 渲染函数 */
    return () => (
      <el-card class="login-card">
        <login-form
          v-show={unref(getLoginState) === LoginStateEnum.LOGIN}
        ></login-form>
        <regist-form
          v-show={unref(getLoginState) === LoginStateEnum.REGISTER}
        ></regist-form>
        <update-form
          v-show={unref(getLoginState) === LoginStateEnum.RESET_PASSWORD}
        ></update-form>
      </el-card>
    );
  },
});

export default loginCard;
